﻿.gradient(@color-from, @color-to, @position-from, @position-to) {
    background: color-from; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url();
    background: -moz-linear-gradient(top, @color-from @position-from, @color-to @position-to); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(@position-from,@color-from), color-stop(@position-to,@color-to)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, @color-from @position-from,@color-to @position-to); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, @color-from @position-from,@color-to @position-to); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, @color-from @position-from,@color-to @position-to); /* IE10+ */
    background: linear-gradient(to bottom, @color-from @position-from,@color-to @position-to); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@color-from', endColorstr='@color-to',GradientType=0 ); /* IE6-8 */
}

html, body, div, ul, li, a, fieldset, legend, label, input, select, option, textarea, button {
    padding: 0;
    margin: 0;
}

body {

    ul#popup-box {
        list-style-type: none;
        width: 110px;

        & > li {
            border-bottom: 1px solid black;

            &:first-of-type {
                border-top: 1px solid black;
            }

            & > a {
                text-decoration: none;
                display: inline-block;
                padding-top: 5px;
                padding-left: 5px;
                padding-bottom: 7px;
                color: black;

                & > img {
                    display: inline-block;
                    height: 25px;
                }
            }

            & >a.current {
                font-weight: bold;
            }
        }
    }

    #wrapper {
        margin-left: 15px;
        margin-top: 15px;
    }

    .popup-item > a {
        border: 1px poslid black;
    }

    .popup-item {
        position: relative;
    }

    .popup-content {
        position: absolute;
        left: 120px;
        top: 0px;

        a {
            border: 1px solid black;
            padding: 1px 5px 1px 5px;
            position: absolute;
            left: 180px;
            top: 15px;
            text-decoration: none;
            color: black;
            border-radius: 5px;
        }

        div > fieldset {
            border: 1px solid black;
            padding: 15px 15px 15px 15px;



            & > legend {
                padding: 0 2px;
                color: #333333;
                font-size: 1.2em;
                font-weight: bold;
            }

            button {
                color: #333333;
                .gradient(#cacaca,#686868,0%,100%);
                padding: 5px 10px;
                border-radius: 20px;
                border: 0;

                &:hover {
                    background: #cccccc;
                }
            }
        }
    }

    div.invisible {
        display: none;
    }
}
